import React, {useEffect, useState} from 'react';
import clone from 'clone';
import { Row, Col } from 'antd';
import LayoutWrapper from '@iso/components/utility/layoutWrapper';
import basicStyle from '@iso/assets/styles/constants';
import IsoWidgetsWrapper from '@iso/containers/Widgets/WidgetsWrapper';

import StickerWidget from '@iso/containers/Widgets/Sticker/StickerWidget';



import {
  dataList,
} from '@iso/containers/Tables/AntTables/AntTables';
import axios from "@iso/http";



const tableDataList = clone(dataList);
tableDataList.size = 5;
const styles = {
  wisgetPageStyle: {
    display: 'flex',
    flexFlow: 'row wrap',
    alignItems: 'flex-start',
    overflow: 'hidden',
  },
};








export default function() {
  const { rowStyle, colStyle } = basicStyle;

  const [data,setData]=useState({eventCount:0,noteCount:0})

  const loadData=() =>{

    axios.post('api/oa/dashboard/getData',{headers: {'Content-Type': 'application/x-www-form-urlencoded'}})
        .then((response)=>{
          let  data=response.data.data;
           setData(data)
        })
        .catch(function (error) {
          console.log(error);
        });

  }
  // this method is the same as componentDidMount method in class  component
  useEffect(()=>{
   // loadData()
  },[])
  return (
    <LayoutWrapper>
      <div style={styles.wisgetPageStyle}>
        <Row style={rowStyle} gutter={0} justify="start">
          <Col lg={6} md={12} sm={12} xs={24} style={colStyle} key={1}>
            <IsoWidgetsWrapper>
              {/* Sticker Widget */}
              <StickerWidget
                  number={data.eventCount}
                  text='近期日程'
                  icon='ion-calendar'
                  fontColor='#ffffff'
                  bgColor='#7266BA'
              />
            </IsoWidgetsWrapper>
          </Col>
          <Col lg={6} md={12} sm={12} xs={24} style={colStyle} key={2}>
            <IsoWidgetsWrapper>
              {/* Sticker Widget */}
              <StickerWidget
                  number={data.noteCount}
                  text='我的笔记'
                  icon='ion-ios-book'
                  fontColor='#ffffff'
                  bgColor='#42A5F6'
              />
            </IsoWidgetsWrapper>
          </Col>
          <Col lg={6} md={12} sm={12} xs={24} style={colStyle} key={3}>
            <IsoWidgetsWrapper>
              {/* Sticker Widget */}
              <StickerWidget
                  number={0}
                  text='我的文件'
                  icon='ion-folder'
                  fontColor='#ffffff'
                  bgColor='#7ED320'
              />
            </IsoWidgetsWrapper>
          </Col>
          <Col lg={6} md={12} sm={12} xs={24} style={colStyle} key={4}>
            <IsoWidgetsWrapper>
              {/* Sticker Widget */}
              <StickerWidget
                  number={0}
                  text='我的消息'
                  icon='ion-email-unread'
                  fontColor='#ffffff'
                  bgColor='#F75D81'
              />
            </IsoWidgetsWrapper>
          </Col>
        </Row>



      </div>
    </LayoutWrapper>
  );
}
